<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../assets/js/vue.js"></script>
    <script>
        Vue.filter("formDate",function(val,fmt){
            var val=new Date(val);
            if(val=="Invalid Date"){
                return " 无效的时间格式";
            }
            let opt={
               "y+": String(val.getFullYear()),
               "M+": String(val.getMonth()+1),
               "d+": String(val.getDay()),
               "H+": String(val.getHours()),
               "m+": String(val.getMinutes()),
               "s+": String(val.getSeconds()),
            }

            for (let  key in opt) {
                var reg= new RegExp(key,"g");
                var p=fmt.match(reg);
                console.log(p)
                if(p){
                    let temp=opt[key].padStart(p.length,"0");
                    fmt=fmt.replace(reg,temp);
                }
            }
            return fmt;
        })
    </script>
</head>
<body>
    <div id="app">
        <div id="wrap">
            <p>yyyy-MM-d  {{ day | formDate("yyyy-M-d")}}</p>
            <p>yyyy年MM月dd日  {{ day | formDate("yyyy年MM月dd日")}}</p>
            <p>yyyy/M/d  {{ day1 | formDate("yyyy/M/d")}}</p>
        </div>
    </div>
    <script>
        new Vue({
            el:"#app",
            data:{
                day:new Date(),
                day1:"sfsad"
            }
        })
    </script>
</body>
</html>